<template>
	<view>
		<Navbar bgc="" color="#fff" v-show="true">提现</Navbar>
		<view class="top">
		</view>
		<view class="content">
			<view class="way">
				<text>提现方式</text><text>到微信零钱</text>
			</view>
			<view class="match">
				<text>提现金额</text><input @blur="amountLimit" id="amount" v-model="amount"  type="number" placeholder="请输入提现金额">元<text @click.stop="drawalAll()">全部</text>
			</view>
		</view>
		<view class="btn" @click="drawalCash()">
			提现
		</view>
		<dialogview v-show="dialogFlag" @cancel="cancel" @confirm="confirm" :param="dialogView"></dialogview>
	</view>
</template>

<script>
	import Navbar from "../../components/nav-bar.vue"
	import dialogview from "../../components/dialogView.vue"
	export default {
		components:{
			dialogview ,
			Navbar
		},
		data() {
			return {
				balance:'',
				amount:'',
				dialogView:{
					style:0,  // 弹出框的样式： 0 1 2
					title:'提示',//弹出层的标题
					content:'确定要这样做吗确定要这样做吗确定要这样做吗确定要这样做吗？',//弹出层的内容
					cancelText:'取消',//取消按钮的文本
					confirmText:'确认',//确认按钮的文本
					data:{code:1000}
				},
				dialogFlag:false,
			}
		},
		methods: {
			drawalAll:function(){
				this.amount = this.balance;
			},
			amountLimit:function(){
				if(this.amount>this.balance){
					this.amount = this.balance;
					console.log(this.amount)
				}
			},
			drawalCash:function(){
				let _this = this
				let param = {
					"token":this.token,
					"amount":this.amount
				}
				this.ajaxJson('doWithdraw',param,function(data){
					console.log(data);
					_this.dialogView = {
						style:2, 
						title:'提示',
						content:'提现成功',//弹出层的内容
						cancelText:'',
						confirmText:'确认',
						data:{}
					}
					_this.dialogFlag =true
				})
			},
			confirm:function(){
				uni.navigateBack({
					
				})
			}
		},
		onLoad:function(option){
			console.log(option);
			this.balance = Number(option.balance);
		}
	}
</script>

<style scoped>
   *{
   	margin: 0;
   	padding: 0;
   	list-style: none;
   	box-sizing: border-box;
   	font-size: 0.75rem;
   }
   .top{
   	   background-color: #FF9972;
   	   height: 8rem;
   	   padding: 3rem 0 0;
   }
   .content{
	   background-color: #FFFFFF;
	   width: 92%;
	   margin: 0 4%;
	   height: 6rem;
	   position: relative;
	   top: -4rem;
	   box-shadow: 0 5px 10px 0px #eee;
	   border-radius: 8px;
   }
   .way{
	   height: 3rem;
	   line-height: 3rem;
	   padding: 0 5%;
   }
   .way text{
	   font-size: 0.85rem;
   }
   .way text:nth-child(2){
	   float: right;
	   color:#FF9972;
   }
   .match{
	   height: 3rem;
	   line-height: 3rem;
	   padding: 0 5%;
   }
   .match input{
	   width: 6rem;
	   display: inline-block;
	   position: relative;
	   top: 0.2rem;
   }
   .match text:nth-child(3){
	   float: right;
   }
   .match input{
	   display: inline-block;
	   margin-left: 1rem;
   }
   .btn{
	   background: -webkit-linear-gradient(left,#FD6431,#FF9972);
	   background: -moz-linear-gradient(left,#FD6431,#FF9972);
	   width: 80%;
	   margin-left:10%;
	   text-align: center;
	   color: #FFFFFF;
	   padding: 0.5rem 0;
	   border-radius: 100px;
	   box-shadow: 0 0 10px 1px #FF9972;
	   position: relative;
	   top: -1rem;
   }
</style>
